import axios from 'axios'
import { ElMessage } from 'element-plus'
import router from '@/router/index.js'

const request = axios.create({
  baseURL: import.meta.env.VITE_BASE_URL,
  timeout: 30000 // 后端接口超时时间
})

// request 拦截器
request.interceptors.request.use(config => {
    // 1.设置传输类型
    // 自动识别 Content-Type
    if (!(config.data instanceof FormData)) {
        config.headers['Content-Type'] = 'application/json;charset=utf-8';
    }

    // 添加 FormData 边界参数自动处理
    if (config.data instanceof FormData) {
        Object.assign(config.headers, {
            'Content-Type': `multipart/form-data; boundary=${new Date().getTime()}`
        });
    }
    // 2.从浏览器的 localStorage 拿出 xm-user 的 token 放入请求头的 token
    let user = JSON.parse(localStorage.getItem('xm-user') || '{}')
    config.headers['token'] = user.token || ''
    return config
}, error => {
    return Promise.reject(error)
});

// response 拦截器
// 可以在接口响应后统一处理结果
request.interceptors.response.use(
  response => {
    let res = response.data;
    // 如果是返回的文件
    if (response.config.responseType === 'blob') {
      return res
    }
    // 兼容服务端返回的字符串数据
    if (typeof res === 'string') {
      res = res ? JSON.parse(res) : res
    }
    if (res.code === '401') {
      // 如果后端接口返回 401，跳转到登录界面
      ElMessage.error(res.msg)
      router.push('/login')
    }
    return res;
  },
  error => {
    if (error.response.status === 404) {
      ElMessage.error('未找到请求接口')
    } else if (error.response.status === 500) {
      ElMessage.error('系统异常，请查看后端控制台报错')
    } else {
      console.error(error.message)
    }
    return Promise.reject(error)
  }
)

export default request